<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/css/bootstrap/bootstrap.css">
<!--    <script src="/js/bootstrap.min.js"></script>-->
    <script src="/js/jquery.js"></script>
    <script src="/js/jquery.mousewheel.js"></script>

    <title>Document</title>
    <style>
        * {
            list-style-type: none;
            padding: 0;
            margin: 0;
        }
        @font-face{
            font-family: QS-R;
            src:url(/font/Quicksand-Regular.ttf);
        }

        @font-face{
            font-family: QS-M;
            src:url(/font/Quicksand-Medium.ttf);
        }
        .nav .nav-content {
            width: 700px;
            margin: 0 auto;
            display:flex;
            align-items:center;
            justify-content :space-between;
        }
        .nav .nav-content h1{
            font-family: QS-R;
            text-align:right;
        }
    </style>
    <style>
        .split-line {
            width:700px;
            margin: 0 auto;
            display:flex;
            align-items:center;
            justify-content :space-between;
        }
        .dot {
            font-size:0;
            border-radius: 50%;
            border: 5px solid black;

        }
    </style>
    <style>
        .main {
            width:700px;
            margin: 15px auto 0;
        }
        .main .right-content {
            width:500px;
            height:550px;

            border: 8px solid #004aad;
            border-radius:16px;
            padding-top: 15px;
        }
        .main .right-content{
            font-family: QS-M;
        }

        .main .right-content .course-detail .chapter {
            margin:9px 0;
        }
        .main .right-content .course-detail .course-item {
            width:460px;
            border: 6px solid #004aad;
            margin: 0 auto;


        }
        .main .right-content .course-detail .title-content {
            font-family: Arial;
            font-weight:700;
            font-size: 24px;
        }

        .main .right-content .course-detail .detail-content {
            border-top: 1px solid darkblue;
            font-size: 16px;
            font-weight: 600;
        }
        .main .right-content .course-detail .detail-content div{
            margin:10px 0;
            font-size: 16px;
        }
        .sub-split-line {
            width:170px;
            margin: 0 auto;
            display:flex;
            align-items:center;
            justify-content :space-between;
        }


    </style>
    <style>
        /*.ppt-bar::before {*/
        /*    background:url("./images/pptm.png") no-repeat;*/
        /*    padding:4px;*/
        /*    font-size:0;*/
        /*    content:""*/
        /*}*/
        .ppt-icon {
            padding-top:1px
        }
    </style>
    <style>
        .main .content {
            float:left;
        }
        .left-content {
            height:600px
        }

        .left-content .course-list-container {

        }

        .left-content .course-list-container .course-list-title {
            font-family: QS-R;
            font-weight: bolder;
            font-size:24px
        }
        .left-content .course-list-container .course-list-title span {
            margin-right: 6px;
            color: #1b6d85;
            top:5px
        }

        .left-content .course-list-container .course-list .course {
            font-family: QS-M;
            font-weight: 600;
            font-size:20px;
            color:darkgray;
        }
        .left-content .course-list-container .course-list {


        }
        .left-content .course-list-container .course-list .selected-course {
            color:black;
        }
        .nav .wel-content div {
            font-size:32px;
            font-family: QS-R;
            font-weight: 900;
            text-align: right;
        }

    </style>
    <style>
        .clearfix::after {
            content:"";
            display: block;
            height:0;
            clear: both;
        }
        .left-content .course-func-bar-list .bar-list {
            width:170px;
            font-family: QS-R;
            font-size: 16px;
            text-align: center;
            background-color:#004aad;
            color:white;
            margin:20px 10px;
            border-radius: 8px;
        }
        .left-content .course-func-bar-list .bar-list .btn:hover {
            text-decoration: underline;
            color: white;
        }
    </style>
    <style>
        .left-content .course-list-viewport{
            width: 190px;
            height: 145px;
            overflow: hidden;
            position: relative;
        }
        .fixed{
            position: absolute;
            top: 0;
            right: 30px;
        }


        .left-content .course-list .course:hover {
            cursor: pointer;
            color: #004aad;
            font-size: 24px;
        }

        .left-content .course-list-container .course-list li[class~=selected-course]:hover{
            cursor: pointer;
            color: black;
            font-size: 20px;
        }

        .loading-bar {
            width:150px;
            height:110px;
            border-radius:8px;
            background-color:#707070;
            opacity:0.8;
            position:absolute;
            left:0;
            right:0;
            top:0;
            bottom:0;
            margin: auto;
            text-align: center;
        }
        @keyframes loading{
            0% {
                transform:rotate(0deg)
            }
            100%{
                transform:rotate(360deg)
            }
        }
        .loading-icon {
            animation:loading linear 1s infinite;
        }
    </style>
    <style>
        .upload-btn {
            cursor: pointer;
        }
        .add-topic{
            background-color: rgba(157,157,157,.15);
        }

        .upload-bar {
            background-color: white;
            position: absolute;
            width: 300px;
            height: 150px;
            position: absolute;
            left: 50%;
            top: 50%;
            margin-top: -50px;
            margin-left: -54px;    /* 宽度的一半 */
            z-index: 998;
            border-radius: 8px;
            border: 3px #004aad solid;
        }
        .add-topic:hover{
            cursor: pointer;
        }
        .disabled-style {
            color:darkgray;
        }
        .detail .file{
            position: absolute;
            top: 0px;
            opacity: 0;
        }
        .detail .file:hover{
            cursor: pointer;
        }
        .detail {

            height: 45px;
            line-height: 42px;
            width: 261px;
            margin: 0 auto;
            margin-top: 24px;
        }
        .detail .file {
            position: absolute;
            top: 0;
            opacity: 0;

        }
        .upload-bar .btn{
            width: 120px;
            font-family: QS-R;
            font-size: 16px;
            text-align: center;
            background-color: mediumblue;
            color: white;
            margin-top: 20px;
            margin-left: 172px;
            border-radius: 8px;
        }
        .ppt-bar-item:hover {
            cursor: pointer;
            text-decoration:underline
        }
    </style>
</head>
<body onload="loadCourseTopicBar()" style="position: relative">

    <div class="upload-bar" style="display: none">
        <div class="upload-content">
            <div class="mg detail add-topic" style="position: relative">
                <span class="glyphicon glyphicon-plus" style="color: #1758E9;margin: 0 5px"></span>
                <span id="fileName" class="disabled-style">Uplodate attachrpent here</span>
                <input type="file" name="file"  class="form-control file" id="exampleInputFile" placeholder="Uplodate attachrpent here">
            </div>
            <div id="submit"  class="submit">
                <div  class="btn">Submit</div>
            </div>
        </div>
    </div>

    <div class="nav">
        <div class="nav-content">
            <div class="logo"><img src="/image/LOGO.png"  style="width:222px;height:114px;"></div>
            <div class="wel-content">
                <div>Welcome!</div>
                <div class="crouse-name">SSK3313 G4</div>
            </div>
        </div>
    </div>
    <div class="split-line">
        <span class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
            class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
            class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
            class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
            class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
            class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
            class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
            class="dot"></span><span class="dot"></span>
    </div>
    <div class="main clearfix">
        <div class="content left-content">
            <div class="course-list-container">
                <div class="course-list-title"><span class="glyphicon glyphicon-triangle-bottom"></span>Course</div>
                <div id="course-list-viewport" class="course-list-viewport">
                    <ul id="course-list" class="course-list fixed" th:object="${user}">
                        <input type="hidden" id="currentCourseId" name="currentCourseId" th:value="${user.courses.get(0).courseId}">
                        <input type="hidden" id="currentUniId" name="currentUniId" th:value="${user.courses.get(0).uniId}">
                        <input type="hidden" id="currentCourseGroup" name="currentCourseGroup" th:value="${user.courses.get(0).courseGroup}">
                        <input type="hidden" id="currentUserRole" name="currentUserRole" th:value="${user.role}">
                        <input type="hidden" id="currentUserId" name="currentUserId" th:value="${user.userId}">

                        <input type="hidden" id="currentItemId" name="currentItemId">
                        <input type="hidden" id="curremtItemType" name="curremtItemType">

                        <li th:each="course,courseSta:*{courses}" th:courseId="${course.courseId}" th:uniId="${course.uniId}"  th:courseGroup="${course.courseGroup}" th:class="${courseSta.first}?'course selected-course':'course'" >
                            <span th:text="|${course.courseId}-${course.courseGroup}|">SSK3313-4</span>
                        </li>
                    </ul>
                </div>

            </div>
            <div class="sub-split-line">
                <span class="dot"></span><span class="dot"></span><span class="dot"></span><span class="dot"></span><span
                    class="dot"></span><span class="dot"></span><span class="dot"></span><span
                    class="dot"></span><span class="dot"></span><span class="dot"></span>
            </div>
            <div class="course-func-bar-list">
                <ul class="func-bar-list" >
                    <li class="bar-list btn-style-comment">
                        <div class="btn">
                            <a style="color: white" href="/courseBordTeacher">Course Board</a></div>
                    </li>
                    <li class="bar-list btn-style-comment" th:object="${user.courses.get(0)}">
                        <div class="btn" th:switch="${user.role}">
                            <a id="uploda" th:case="'eductor'" style="color: white" th:href="@{/course/createCourseTopic/{uniId}/{courseId}/{courseGroup}(uniId=*{uniId},courseId=*{courseId},courseGroup=*{courseGroup})}">Upload</a>
                            <a th:case="'learner'" style="color: white" href="/timetable">MySchedule</a>
                        </div>
                    </li>
                    <li class="bar-list btn-style-comment">
                        <div class="btn" th:switch="${user.role}">
                            <a th:case="'eductor'" style="color: white" th:href="@{/courseBordTeacher/crades}">GradesMark</a>
                            <a th:case="'learner'" style="color: white" href="/grade">MyGrade</a>
                        </div>
                    </li>
                    <li class="bar-list btn-style-comment">
                        <div class="btn">
                            <a style="color: white" href="/drive">Drive</a>
                        </div>
                    </li>
                    <li class="bar-list btn-style-comment">
                        <div class="btn btn-style-comment" id="participants">Participants</div>
                    </li>
                </ul>
            </div>
            
        </div>
        <div class="content right-content"  style="position: relative">
            <div class="course-detail" id="course-detail">
                <div class="loading-bar" id="loading-bar" style="display:none;">
                    <p>
                        <svg t="1642230754233" class="loading-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8715" id="mx_n_1642230754236" data-spm-anchor-id="a313x.7781069.0.i39" width="64" height="64"><path d="M512 337.322667a26.666667 26.666667 0 0 1-26.666667-26.666667V197.333333a26.666667 26.666667 0 1 1 53.333334 0v113.322667c0 14.762667-11.946667 26.666667-26.666667 26.666667z" fill="#707070" p-id="8716" data-spm-anchor-id="a313x.7781069.0.i49" class="selected"></path><path d="M424.661333 360.746667a26.666667 26.666667 0 0 1-36.394666-9.728l-56.661334-98.133334a26.666667 26.666667 0 0 1 46.122667-26.666666l56.661333 98.133333a26.624 26.624 0 0 1-9.728 36.394667z" fill="#707070" opacity=".9" p-id="8717" data-spm-anchor-id="a313x.7781069.0.i48" class="selected"></path><path d="M360.746667 424.661333a26.624 26.624 0 0 1-36.394667 9.728l-98.133333-56.661333a26.624 26.624 0 1 1 26.666666-46.122667l98.133334 56.661334c12.714667 7.338667 17.066667 23.68 9.728 36.394666z" fill="#707070" opacity=".85" p-id="8718" data-spm-anchor-id="a313x.7781069.0.i47" class=""></path><path d="M337.322667 512c0 14.72-11.946667 26.666667-26.666667 26.666667H197.333333a26.666667 26.666667 0 1 1 0-53.333334h113.322667c14.762667 0 26.666667 11.946667 26.666667 26.666667z" fill="#707070" opacity=".8" p-id="8719" data-spm-anchor-id="a313x.7781069.0.i46" class=""></path><path d="M360.746667 599.338667a26.666667 26.666667 0 0 1-9.728 36.394666l-98.133334 56.661334a26.666667 26.666667 0 0 1-26.666666-46.122667l98.133333-56.661333a26.624 26.624 0 0 1 36.394667 9.728z" fill="#8a8a8a" opacity=".75" p-id="8720" data-spm-anchor-id="a313x.7781069.0.i45" class=""></path><path d="M424.661333 663.253333a26.624 26.624 0 0 1 9.728 36.394667l-56.661333 98.133333a26.624 26.624 0 1 1-46.122667-26.666666l56.661334-98.133334a26.666667 26.666667 0 0 1 36.394666-9.728z" fill="#8a8a8a" opacity=".7" p-id="8721" data-spm-anchor-id="a313x.7781069.0.i44" class=""></path><path d="M512 686.677333c14.72 0 26.666667 11.946667 26.666667 26.666667v113.322667a26.666667 26.666667 0 1 1-53.333334 0v-113.322667c0-14.762667 11.946667-26.666667 26.666667-26.666667z" fill="#8a8a8a" opacity=".65" p-id="8722" data-spm-anchor-id="a313x.7781069.0.i43" class=""></path><path d="M599.338667 663.253333a26.666667 26.666667 0 0 1 36.394666 9.728l56.661334 98.133334a26.666667 26.666667 0 0 1-46.122667 26.666666l-56.661333-98.133333a26.624 26.624 0 0 1 9.728-36.394667z" fill="#8a8a8a" opacity=".6" p-id="8723" data-spm-anchor-id="a313x.7781069.0.i42" class=""></path><path d="M663.253333 599.338667a26.624 26.624 0 0 1 36.394667-9.728l98.133333 56.661333a26.624 26.624 0 1 1-26.666666 46.122667l-98.133334-56.661334a26.666667 26.666667 0 0 1-9.728-36.394666z" fill="#cdcdcd" opacity=".55" p-id="8724" data-spm-anchor-id="a313x.7781069.0.i41" class=""></path><path d="M686.677333 512c0-14.72 11.946667-26.666667 26.666667-26.666667h113.322667a26.666667 26.666667 0 1 1 0 53.333334h-113.322667a26.666667 26.666667 0 0 1-26.666667-26.666667z" fill="#cdcdcd" opacity=".5" p-id="8725" data-spm-anchor-id="a313x.7781069.0.i40" class=""></path><path d="M663.253333 424.661333a26.666667 26.666667 0 0 1 9.728-36.394666l98.133334-56.661334a26.666667 26.666667 0 0 1 26.666666 46.122667l-98.133333 56.661333a26.624 26.624 0 0 1-36.394667-9.728z" fill="#ffffff" opacity=".4" p-id="8726" data-spm-anchor-id="a313x.7781069.0.i38" class=""></path><path d="M599.338667 360.746667a26.624 26.624 0 0 1-9.728-36.394667l56.661333-98.133333a26.624 26.624 0 1 1 46.122667 26.666666l-56.661334 98.133334a26.666667 26.666667 0 0 1-36.394666 9.728z" fill="#ffffff" opacity=".3" p-id="8727" data-spm-anchor-id="a313x.7781069.0.i36" class=""></path></svg>
                    </p>
                    <p>
                        <span id="load-msg" style="color:white;font-size:14px">Loading</span>
                    </p>

                </div>
            </div>
        </div>
    </div>
    <script>
        document.getElementById('course-list-viewport').addEventListener('mousewheel', function(e) {
            e.stopPropagation();
            e.preventDefault();
            let currentHeight = document.getElementById("course-list").style.height;
            if (e.wheelDeltaY>0){
                console.log("向上滚")
                if (document.getElementById("course-list").style.top>0){
                    $("#course-list").stop().animate({
                        top:0
                    })
                    return;
                }
                $("#course-list").stop().animate({
                    top:'+=30'
                },100)

            }else {
                console.log("乡下滚")

                $("#course-list").stop().animate({
                    top:'-=30'
                })
            }
        }, false);
    </script>
    <script>
        function loadCourseTopicBar(){
            $("#loading-bar").show();
            let currentCourseId = $("#currentCourseId").val();
            let currentUniId = $("#currentUniId").val();
            let currentCourseGroup = $("#currentCourseGroup").val();
            $.ajax({
                url:`/course/loadCourseTopicBar/${currentUniId}/${currentCourseId}/${currentCourseGroup}`,
                dataType:"JSON",
                method:"GET",
                success:function (data) {
                    let currentUserRole = document.getElementById("currentUserRole").value;
                    if (data.code===true){
                        let courseTopics = data.data;
                        for (let i=0;i<courseTopics.length;i++){
                            let outHtml = $(`<div topicId="${courseTopics[i].topicId}" class="chapter topic-bar"><div class="course-item title-content">${courseTopics[i].topicName}<span class="ppt-icon-content delete-topic-btn" style="position:relative;padding: 0 12px; margin-left:-1px;">
                                                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1642941841293" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="29828" width="16" height="16"><path d="M732.3 939H255.2c-30.1 0-54.5-24.5-54.5-54.5V420.9h65.4v452.6h455.3V421h65.4v463.5c0 30-24.4 54.5-54.5 54.5z" fill="#4A5FE2" p-id="29829"></path><path d="M699.3 247.4h-65.4v-55c0-12.9-10.5-23.4-23.4-23.4H376.9c-12.9 0-23.4 10.5-23.4 23.4V247h-65.4V142.4c0-19.3 16.2-38.9 47.2-38.9h316.8c31 0 47.2 19.5 47.2 38.9v105z" fill="#A1AFFF" p-id="29830"></path><path d="M807.3 362.3H180.2c-18 0-32.7-14.7-32.7-32.7 0-18 14.7-32.7 32.7-32.7h627.1c18 0 32.7 14.7 32.7 32.7 0 18-14.7 32.7-32.7 32.7z" fill="#4A5FE2" p-id="29831"></path><path d="M406.5 757.2c-18 0-32.7-14.7-32.7-32.7V497.3c0-18 14.7-32.7 32.7-32.7 18 0 32.7 14.7 32.7 32.7v227.2c0 18-14.7 32.7-32.7 32.7zM581 757.2c-18 0-32.7-14.7-32.7-32.7V497.3c0-18 14.7-32.7 32.7-32.7 18 0 32.7 14.7 32.7 32.7v227.2c0 18-14.7 32.7-32.7 32.7z" fill="#A1AFFF" p-id="29832"></path></svg>
                                                            </span></div></div>`);
                            let innerHtml = $("<div class=\"course-item detail-content\"></div>");
                            let courseTopicItems = courseTopics[i].courseTopicItems;
                            for (let j=0;j<courseTopicItems.length;j++){
                                let topicItemHtml = $(`<div class=\"ppt-bar\" itemid="${courseTopicItems[j].itemId}"></div>`)
                                if (courseTopicItems[j].itemType.toUpperCase()==="MESSAGE"){
                                    topicItemHtml.append($(`<span class="ppt-icon-content" style="position:relative;padding: 0 12px">
<!--                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1640261511967" class="ppt-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16518" width="16" height="16"><path d="M968.704 135.168h-430.08v752.64h430.08c15.36 0 26.624-12.288 26.624-26.624V162.816c0-15.36-11.264-27.648-26.624-27.648z" fill="#FF8A65" p-id="16519"></path><path d="M512 646.144h376.832v53.248H512z m0 107.52h376.832v54.272H512z m161.792-483.328c-89.088 0-161.792 72.704-161.792 161.792C512 521.216 584.704 593.92 673.792 593.92s161.792-72.704 161.792-161.792H673.792V270.336z" fill="#FBE9E7" p-id="16520"></path><path d="M727.04 216.064v161.792h161.792c0-89.088-72.704-161.792-161.792-161.792z" fill="#FBE9E7" p-id="16521"></path><path d="M592.896 996.352L28.672 888.832V135.168L592.896 27.648z" fill="#E64A19" p-id="16522"></path><path d="M319.488 327.68H192.512v368.64h78.848V569.344h40.96c44.032 0 78.848-11.264 104.448-34.816 25.6-22.528 38.912-53.248 38.912-90.112C455.68 366.592 409.6 327.68 319.488 327.68z m-14.336 178.176h-33.792V391.168h33.792c43.008 0 64.512 18.432 64.512 56.32 0 39.936-21.504 58.368-64.512 58.368z" fill="#FFFFFF" p-id="16523"></path></svg>-->
                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%); t="1642938375625" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11109" width="16" height="16"><path d="M846.933333 320v305.066667c0 66.133333-55.466667 121.6-121.6 121.6H206.933333v29.866666c0 51.2 40.533333 91.733333 91.733334 91.733334h503.466666L938.666667 960V411.733333c0-51.2-40.533333-91.733333-91.733334-91.733333z m0 0" fill="#FF8F6B" p-id="11110"></path><path d="M221.866667 684.8L85.333333 776.533333V198.4C85.333333 147.2 125.866667 106.666667 177.066667 106.666667h518.4c51.2 0 91.733333 40.533333 91.733333 91.733333v396.8c0 51.2-40.533333 91.733333-91.733333 91.733333H221.866667z" fill="#D35230" p-id="11111"></path><path d="M177.066667 396.8c0 17.066667 8.533333 32 23.466666 40.533333 14.933333 8.533333 32 8.533333 44.8 0 14.933333-8.533333 23.466667-23.466667 23.466667-40.533333 0-17.066667-8.533333-32-23.466667-40.533333-14.933333-8.533333-32-8.533333-44.8 0-14.933333 8.533333-23.466667 23.466667-23.466666 40.533333z m0 0M390.4 396.8c0 17.066667 8.533333 32 23.466667 40.533333 14.933333 8.533333 32 8.533333 44.8 0 14.933333-8.533333 23.466667-23.466667 23.466666-40.533333 0-17.066667-8.533333-32-23.466666-40.533333-14.933333-8.533333-32-8.533333-44.8 0-14.933333 8.533333-23.466667 23.466667-23.466667 40.533333z m0 0M603.733333 396.8c0 17.066667 8.533333 32 23.466667 40.533333 14.933333 8.533333 32 8.533333 44.8 0 14.933333-8.533333 23.466667-23.466667 23.466667-40.533333 0-17.066667-8.533333-32-23.466667-40.533333-14.933333-8.533333-32-8.533333-44.8 0-14.933333 8.533333-23.466667 23.466667-23.466667 40.533333z m0 0" fill="#FFFFFF" opacity=".95" p-id="11112"></path></svg>
                            </span>`))
                                }else if (courseTopicItems[j].itemType.toUpperCase()==="VIDEO"){
                                    topicItemHtml.append($(`<span class="ppt-icon-content" style="position:relative;padding: 0 12px">
<!--                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1640261511967" class="ppt-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16518" width="16" height="16"><path d="M968.704 135.168h-430.08v752.64h430.08c15.36 0 26.624-12.288 26.624-26.624V162.816c0-15.36-11.264-27.648-26.624-27.648z" fill="#FF8A65" p-id="16519"></path><path d="M512 646.144h376.832v53.248H512z m0 107.52h376.832v54.272H512z m161.792-483.328c-89.088 0-161.792 72.704-161.792 161.792C512 521.216 584.704 593.92 673.792 593.92s161.792-72.704 161.792-161.792H673.792V270.336z" fill="#FBE9E7" p-id="16520"></path><path d="M727.04 216.064v161.792h161.792c0-89.088-72.704-161.792-161.792-161.792z" fill="#FBE9E7" p-id="16521"></path><path d="M592.896 996.352L28.672 888.832V135.168L592.896 27.648z" fill="#E64A19" p-id="16522"></path><path d="M319.488 327.68H192.512v368.64h78.848V569.344h40.96c44.032 0 78.848-11.264 104.448-34.816 25.6-22.528 38.912-53.248 38.912-90.112C455.68 366.592 409.6 327.68 319.488 327.68z m-14.336 178.176h-33.792V391.168h33.792c43.008 0 64.512 18.432 64.512 56.32 0 39.936-21.504 58.368-64.512 58.368z" fill="#FFFFFF" p-id="16523"></path></svg>-->
                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);" t="1642938053736" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6517" width="16" height="16"><path d="M102.4 153.6m76.8 0l665.6 0q76.8 0 76.8 76.8l0 563.2q0 76.8-76.8 76.8l-665.6 0q-76.8 0-76.8-76.8l0-563.2q0-76.8 76.8-76.8Z" fill="#FF7C83" p-id="6518"></path><path d="M445.1072 385.0624C425.4976 373.8496 409.6 383.168 409.6 405.696v212.5824c0 22.6176 15.8976 31.8464 35.5072 20.6336l186.2784-106.624c19.6096-11.2128 19.6096-29.4016 0-40.6272l-186.2784-106.5984z" fill="#E05050" p-id="6519"></path></svg>
                            </span>`))
                                }else if (courseTopicItems[j].itemType.toUpperCase()==="TASK"){
                                    topicItemHtml.append($(`<span class="ppt-icon-content" style="position:relative;padding: 0 12px">
<!--                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1640261511967" class="ppt-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16518" width="16" height="16"><path d="M968.704 135.168h-430.08v752.64h430.08c15.36 0 26.624-12.288 26.624-26.624V162.816c0-15.36-11.264-27.648-26.624-27.648z" fill="#FF8A65" p-id="16519"></path><path d="M512 646.144h376.832v53.248H512z m0 107.52h376.832v54.272H512z m161.792-483.328c-89.088 0-161.792 72.704-161.792 161.792C512 521.216 584.704 593.92 673.792 593.92s161.792-72.704 161.792-161.792H673.792V270.336z" fill="#FBE9E7" p-id="16520"></path><path d="M727.04 216.064v161.792h161.792c0-89.088-72.704-161.792-161.792-161.792z" fill="#FBE9E7" p-id="16521"></path><path d="M592.896 996.352L28.672 888.832V135.168L592.896 27.648z" fill="#E64A19" p-id="16522"></path><path d="M319.488 327.68H192.512v368.64h78.848V569.344h40.96c44.032 0 78.848-11.264 104.448-34.816 25.6-22.528 38.912-53.248 38.912-90.112C455.68 366.592 409.6 327.68 319.488 327.68z m-14.336 178.176h-33.792V391.168h33.792c43.008 0 64.512 18.432 64.512 56.32 0 39.936-21.504 58.368-64.512 58.368z" fill="#FFFFFF" p-id="16523"></path></svg>-->
                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);" t="1642675678092" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8567" width="16" height="16"><path d="M190.01344 173.30176h642.85696c70.71744 0 128.57344 57.856 128.57344 128.57344V864.3584c0 45.0048-35.35872 80.36352-80.36352 80.36352H190.01344C119.296 944.73216 61.44 886.87616 61.44 816.15872V301.8752c0-70.71744 57.856-128.57344 128.57344-128.57344z" fill="#FFBB96" p-id="8568"></path><path d="M190.01344 173.30176h642.85696c70.71744 0 128.57344 57.856 128.57344 128.57344v401.78688l-128.57344 115.712-3.21536 3.21536-128.57344 122.14272h-511.0784C119.296 944.73216 61.44 886.87616 61.44 816.15872V301.8752c0-70.71744 57.856-128.57344 128.57344-128.57344z" fill="#CF5A1A" p-id="8569"></path><path d="M190.01344 173.30176h642.85696c70.71744 0 128.57344 57.856 128.57344 128.57344v401.78688H784.65024c-44.99456 0-80.35328 35.34848-80.35328 80.35328v160.7168H190.01344C119.296 944.73216 61.44 886.87616 61.44 816.15872V301.8752c0-70.71744 57.856-128.57344 128.57344-128.57344z" fill="#FF7A45" p-id="8570"></path><path d="M350.72 76.87168c19.29216 0 32.1536 12.86144 32.1536 32.14336v147.8656c0 19.27168-12.86144 32.13312-32.1536 32.13312-19.28192 0-32.13312-12.86144-32.13312-32.14336v-147.8656c0-19.27168 12.8512-32.13312 32.14336-32.13312z m321.4336 0c19.28192 0 32.14336 12.86144 32.14336 32.14336v147.8656c0 19.27168-12.86144 32.13312-32.14336 32.13312-19.28192 0-32.14336-12.86144-32.14336-32.14336v-147.8656c0-19.27168 12.86144-32.13312 32.1536-32.13312zM286.44352 494.72512a48.20992 48.20992 0 1 0 96.43008 0 48.20992 48.20992 0 0 0-96.43008 0zM511.4368 462.58176H704.3072c19.28192 0 32.14336 12.86144 32.14336 32.1536 0 19.28192-12.86144 32.13312-32.14336 32.13312H511.4368c-19.28192 0-32.14336-12.8512-32.14336-32.14336 0-19.28192 12.86144-32.14336 32.1536-32.14336z m0 160.7168H704.3072c19.28192 0 32.14336 12.86144 32.14336 32.1536 0 19.27168-12.86144 32.13312-32.14336 32.13312H511.4368c-19.28192 0-32.14336-12.86144-32.14336-32.14336 0-19.28192 12.86144-32.14336 32.1536-32.14336zM286.44352 655.44192a48.20992 48.20992 0 1 0 96.43008 0 48.20992 48.20992 0 0 0-96.43008 0z" fill="#FFBB96" p-id="8571"></path></svg>
                            </span>`))
                                }else if (courseTopicItems[j].itemType.toUpperCase()==="TEST"){
                                    topicItemHtml.append($(`<span class="ppt-icon-content" style="position:relative;padding: 0 12px">
<!--                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1640261511967" class="ppt-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16518" width="16" height="16"><path d="M968.704 135.168h-430.08v752.64h430.08c15.36 0 26.624-12.288 26.624-26.624V162.816c0-15.36-11.264-27.648-26.624-27.648z" fill="#FF8A65" p-id="16519"></path><path d="M512 646.144h376.832v53.248H512z m0 107.52h376.832v54.272H512z m161.792-483.328c-89.088 0-161.792 72.704-161.792 161.792C512 521.216 584.704 593.92 673.792 593.92s161.792-72.704 161.792-161.792H673.792V270.336z" fill="#FBE9E7" p-id="16520"></path><path d="M727.04 216.064v161.792h161.792c0-89.088-72.704-161.792-161.792-161.792z" fill="#FBE9E7" p-id="16521"></path><path d="M592.896 996.352L28.672 888.832V135.168L592.896 27.648z" fill="#E64A19" p-id="16522"></path><path d="M319.488 327.68H192.512v368.64h78.848V569.344h40.96c44.032 0 78.848-11.264 104.448-34.816 25.6-22.528 38.912-53.248 38.912-90.112C455.68 366.592 409.6 327.68 319.488 327.68z m-14.336 178.176h-33.792V391.168h33.792c43.008 0 64.512 18.432 64.512 56.32 0 39.936-21.504 58.368-64.512 58.368z" fill="#FFFFFF" p-id="16523"></path></svg>-->
                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);" t="1642940701568" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13634" width="16" height="16"><path d="M616.34 777.05h5.03l-28.07-29.23 23.04 29.23zM878.48 247H848l-16.31 44.83a4 4 0 0 1-5.13 2.39L696.78 247h-13.24l138.39 50.37-174.61 479.68h231.16a17 17 0 0 0 17-17V264a17 17 0 0 0-17-17zM557.13 247H145.52a17 17 0 0 0-17 17v496.1a17 17 0 0 0 17 17h259.67L387 715.47S512.91 367.46 557.13 247z" fill="#C5EAFF" p-id="13635"></path><path d="M831.65 291.78L848 247l13.36-36.7a65.43 65.43 0 0 0-39-83.63L691.47 79a72.21 72.21 0 0 0-92.28 43l-27.36 75.19a4 4 0 0 0 2.39 5.13L696.78 247l129.74 47.22a4 4 0 0 0 5.13-2.44z" fill="#EF6A6A" p-id="13636"></path><path d="M683.54 247l-111.28-40.5c-0.17-0.07-5.85 15.21-15.13 40.5C512.91 367.46 387 715.47 387 715.47l76.38-17.14 52.77 59.76 77.16-10.27 28.07 29.23 18.82 19.61 7.13-19.61 174.6-479.73z" fill="#F9DB91" p-id="13637"></path><path d="M516.14 758.09l-52.77-59.76-76.38 17.14 18.2 61.58L452.3 936.5l188.23-128.75-24.19-30.7-23.04-29.23-77.16 10.27z" fill="#FFEBD7" p-id="13638"></path><path d="M878.48 234h-13.17l7.4-20.35a72.09 72.09 0 0 0-43.08-92.4L684.47 68.37a72 72 0 0 0-92.39 43.08L547.49 234h-402a30.09 30.09 0 0 0-30 30v496.1a30.09 30.09 0 0 0 30 30H390.2l47.21 162.52a10.28 10.28 0 0 0 15.69 5.63L645.34 827a20.58 20.58 0 0 0 7.74-10l9.82-27h215.58a30.09 30.09 0 0 0 30-30V264a30.09 30.09 0 0 0-30-30z m-262-113.61A46.24 46.24 0 0 1 659.82 90a45.84 45.84 0 0 1 15.75 2.8l145.16 52.83a46.09 46.09 0 0 1 27.54 59.07l-27.61 75.88-231.77-84.36zM746.92 281.4l-165.2 453.9-61.32 12.27L478.3 695l164.35-451.55z m-128.7-46.84L452.69 689.34 406 698.68l174-478z m-472.7 529.49a4.11 4.11 0 0 1-4-4V264a4.11 4.11 0 0 1 4-4H538L372.48 714.79a20.57 20.57 0 0 0-0.43 12.79l10.6 36.47zM495 898.1l-51.86-18.88-44.29-152.59 61.6-12.33L505 770a13 13 0 0 0 12.7 4.63l70-14 38.43 48zM638.15 782l-31.47-39.3 164.67-452.4 40.42 14.7z m244.33-22a4.11 4.11 0 0 1-4 4H672.36l183.48-504h22.64a4.11 4.11 0 0 1 4 4z" fill="#512C56" p-id="13639"></path><path d="M227.88 435.5h183.81a13 13 0 1 0 0-26H227.88a13 13 0 0 0 0 26zM357.63 517.63H227.88a13 13 0 0 0 0 26h129.75a13 13 0 0 0 0-26z" fill="#512C56" p-id="13640"></path></svg>
                            </span>`))
                                }else if (courseTopicItems[j].itemType.toUpperCase()==="MATERIAL"){
                                    topicItemHtml.append($(`<span class="ppt-icon-content" style="position:relative;padding: 0 12px">
<!--                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1640261511967" class="ppt-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16518" width="16" height="16"><path d="M968.704 135.168h-430.08v752.64h430.08c15.36 0 26.624-12.288 26.624-26.624V162.816c0-15.36-11.264-27.648-26.624-27.648z" fill="#FF8A65" p-id="16519"></path><path d="M512 646.144h376.832v53.248H512z m0 107.52h376.832v54.272H512z m161.792-483.328c-89.088 0-161.792 72.704-161.792 161.792C512 521.216 584.704 593.92 673.792 593.92s161.792-72.704 161.792-161.792H673.792V270.336z" fill="#FBE9E7" p-id="16520"></path><path d="M727.04 216.064v161.792h161.792c0-89.088-72.704-161.792-161.792-161.792z" fill="#FBE9E7" p-id="16521"></path><path d="M592.896 996.352L28.672 888.832V135.168L592.896 27.648z" fill="#E64A19" p-id="16522"></path><path d="M319.488 327.68H192.512v368.64h78.848V569.344h40.96c44.032 0 78.848-11.264 104.448-34.816 25.6-22.528 38.912-53.248 38.912-90.112C455.68 366.592 409.6 327.68 319.488 327.68z m-14.336 178.176h-33.792V391.168h33.792c43.008 0 64.512 18.432 64.512 56.32 0 39.936-21.504 58.368-64.512 58.368z" fill="#FFFFFF" p-id="16523"></path></svg>-->
                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);" t="1642940974661" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="26085" width="16" height="16"><path d="M138.1 579.2v-14.5h507.2c-2-6.5-3.4-13.2-4.2-20h-503v-14.5h502.3c0.2-6.7 1.1-13.4 2.6-20H138v-14.5h509.7c9.8-24 25.8-37.6 25.8-37.6H69.7v157.2h603.8c-9.4-10.8-17.1-23-22.8-36.1H138.1zM138.1 766v-14.5h507.2c-2-6.5-3.4-13.2-4.2-20h-503V717h502.3c0.2-6.7 1.1-13.4 2.6-20H138v-14.5h509.7c9.8-24 25.8-37.6 25.8-37.6H69.7v157.2h603.8c-9.4-10.8-17.1-23-22.8-36.1H138.1zM902.5 692.4l-13.4 5.6-194.8-468.3c-5.2 4.3-10.9 8.2-16.8 11.6l193.2 464.4-13.4 5.6-193-463.8c-6.3 2.4-12.8 4.2-19.4 5.3l194 466.2-13.4 5.6L629.7 254c-25.9 0.2-44.6-9.4-44.6-9.4L817 802l145.1-60.4-231.9-557.4c-6.4 12.8-14.7 24.6-24.6 34.9l196.9 473.3z" fill="#282727" p-id="26086"></path><path d="M644.8 252.6c-5.3 0.8-10.4 1.2-15.3 1.2l195.8 470.7 13.4-5.6-193.9-466.3zM705.6 219.1c-3.7 4-7.5 7.5-11.3 10.7L889.1 698l13.4-5.6-196.9-473.3zM677.5 241.4c-4.4 2.5-8.8 4.5-13.2 6.1l192.9 463.7 13.4-5.6-193.1-464.2z" fill="#E02727" p-id="26087"></path></svg>
                            </span>`))
                                }

                                topicItemHtml.append(`<span onclick="document.location='/course/itemInfo/${courseTopicItems[j].itemId}/${courseTopics[i].courseGroup}/${courseTopics[i].courseId}'" class="ppt-bar-item">${courseTopicItems[j].itemTitle}</span>`);
                                if (currentUserRole==="learner"){
                                    if (courseTopicItems[j].itemType.toUpperCase()==="TASK" || courseTopicItems[j].itemType.toUpperCase()==="TEST") {
                                        topicItemHtml.append($(`<span onclick="upload(${courseTopicItems[j].itemId},'${courseTopicItems[j].itemType}')" class="ppt-icon-content upload-btn" style="position:relative;padding: 0 12px">
<!--                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1640261511967" class="ppt-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16518" width="16" height="16"><path d="M968.704 135.168h-430.08v752.64h430.08c15.36 0 26.624-12.288 26.624-26.624V162.816c0-15.36-11.264-27.648-26.624-27.648z" fill="#FF8A65" p-id="16519"></path><path d="M512 646.144h376.832v53.248H512z m0 107.52h376.832v54.272H512z m161.792-483.328c-89.088 0-161.792 72.704-161.792 161.792C512 521.216 584.704 593.92 673.792 593.92s161.792-72.704 161.792-161.792H673.792V270.336z" fill="#FBE9E7" p-id="16520"></path><path d="M727.04 216.064v161.792h161.792c0-89.088-72.704-161.792-161.792-161.792z" fill="#FBE9E7" p-id="16521"></path><path d="M592.896 996.352L28.672 888.832V135.168L592.896 27.648z" fill="#E64A19" p-id="16522"></path><path d="M319.488 327.68H192.512v368.64h78.848V569.344h40.96c44.032 0 78.848-11.264 104.448-34.816 25.6-22.528 38.912-53.248 38.912-90.112C455.68 366.592 409.6 327.68 319.488 327.68z m-14.336 178.176h-33.792V391.168h33.792c43.008 0 64.512 18.432 64.512 56.32 0 39.936-21.504 58.368-64.512 58.368z" fill="#FFFFFF" p-id="16523"></path></svg>-->
                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);" t="1642945094984" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="30713" width="16" height="16"><path d="M952.8 673.6a40.16 40.16 0 0 0-39.2 39.2c0 86.4-57.6 156.96-130.88 156.96H241.28c-73.28 0-130.88-69.76-130.88-156.96a40.16 40.16 0 0 0-39.2-39.2A40.16 40.16 0 0 0 32 712.8c0 130.88 94.24 235.52 209.28 235.52h541.44c115.04 0 209.28-104.64 209.28-235.52a40.16 40.16 0 0 0-39.2-39.2z" fill="#4592D8" p-id="30714"></path><path d="M536.8 85.12a44.32 44.32 0 0 0-57.44 0l-149.12 149.12a38.88 38.88 0 0 0 54.88 54.88L466.24 208v444.64a39.2 39.2 0 1 0 78.4 0V208l81.12 81.12a38.88 38.88 0 1 0 54.88-54.88z" fill="#4592D8" p-id="30715"></path></svg>
                            </span>`))
                                    }

                                }else {
                                    topicItemHtml.append($(`<span onclick="document.location='/updateItem/${courseTopicItems[j].itemId}/${courseTopics[i].uniId}/${courseTopics[i].courseId}/${courseTopics[i].topicId}'" class="ppt-icon-content revise-btn" style="position:relative;padding: 0 12px; margin-left:10px;">
                                                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);" t="1642941404677" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="28903" width="16" height="16"><path d="M686.4 224c-6.4-6.4-6.4-16 0-22.4l68-68c6.4-6.4 16-6.4 22.4 0l112.8 112.8c6.4 6.4 6.4 16 0 22.4l-68 68c-6.4 6.4-16 6.4-22.4 0L686.4 224zM384 776l372-372c5.6-5.6 4.8-15.2-1.6-20.8L641.6 269.6c-6.4-6.4-16-7.2-20.8-1.6L248 640l-56 192 192-56zM64 896v64h896v-64H64z" p-id="28904" fill="#1296db"></path></svg>
                                                            </span>`))
                                    topicItemHtml.append($(`<span class="ppt-icon-content delete-btn" style="position:relative;padding: 0 12px; margin-left:-1px;">
                                                                <svg style="position:absolute;top:50%;bottom:50%;transform:translate(-50%, -50%);"  t="1642941841293" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="29828" width="16" height="16"><path d="M732.3 939H255.2c-30.1 0-54.5-24.5-54.5-54.5V420.9h65.4v452.6h455.3V421h65.4v463.5c0 30-24.4 54.5-54.5 54.5z" fill="#4A5FE2" p-id="29829"></path><path d="M699.3 247.4h-65.4v-55c0-12.9-10.5-23.4-23.4-23.4H376.9c-12.9 0-23.4 10.5-23.4 23.4V247h-65.4V142.4c0-19.3 16.2-38.9 47.2-38.9h316.8c31 0 47.2 19.5 47.2 38.9v105z" fill="#A1AFFF" p-id="29830"></path><path d="M807.3 362.3H180.2c-18 0-32.7-14.7-32.7-32.7 0-18 14.7-32.7 32.7-32.7h627.1c18 0 32.7 14.7 32.7 32.7 0 18-14.7 32.7-32.7 32.7z" fill="#4A5FE2" p-id="29831"></path><path d="M406.5 757.2c-18 0-32.7-14.7-32.7-32.7V497.3c0-18 14.7-32.7 32.7-32.7 18 0 32.7 14.7 32.7 32.7v227.2c0 18-14.7 32.7-32.7 32.7zM581 757.2c-18 0-32.7-14.7-32.7-32.7V497.3c0-18 14.7-32.7 32.7-32.7 18 0 32.7 14.7 32.7 32.7v227.2c0 18-14.7 32.7-32.7 32.7z" fill="#A1AFFF" p-id="29832"></path></svg>
                                                            </span>`))
                                }

                                innerHtml.append(topicItemHtml)
                            }
                            outHtml.append(innerHtml)
                            $("#course-detail").append(outHtml)

                        }
                        $(".crouse-name").text(currentCourseId+" G"+currentCourseGroup)
                        $("#loading-bar").hide();
                        doLoad()
                    }else {
                        $("#load-msg").text("加载失败！请刷新页面！")
                        setTimeout(()=>{
                            $("#loading-bar").hide();
                            $("#load-msg").text("Loading")
                        },3000)
                    }
                }
            })
        }
    </script>
    <script>
        $(".course").click(function (event) {
            let currentElement = $(event.currentTarget);
            if (currentElement.attr("class")==="course selected-course"){
                return;
            }else {

                $(".selected-course").attr("class","course")
                currentElement.attr("class","course selected-course");
                let newElement = $(".selected-course")

                console.log(newElement.attr("coursegroup"))
                $(".chapter").remove();
                $("#currentCourseId").val(newElement.attr("courseid"));
                $("#currentUniId").val(newElement.attr("uniid"));
                $("#currentCourseGroup").val(newElement.attr("coursegroup"));

                $("#uploda").attr("href",`/course/createCourseTopic/${newElement.attr("uniid")}/${newElement.attr("courseid")}/${newElement.attr("coursegroup")}`)
                loadCourseTopicBar();
            }
        })

        $("#participants").click(function () {
            let currentCourseId = $("#currentCourseId").val();
            let currentUniId = $("#currentUniId").val();
            let currentCourseGroup = $("#currentCourseGroup").val();
            document.location = `/course/participants/${currentUniId}/${currentCourseId}/${currentCourseGroup}`
        })
    </script>
    <script>
        function upload(itemId,itemType) {
            $("#curremtItemType").val(itemType);
            $("#currentItemId").val(itemId)

            $(".upload-bar").show();
            // let userId = $("#currentUserId").val();
            // let uniId = $("#currentUniId").val();
            // let courseId = $("#currentCourseId").val();
            // let courseGroup = $("#currentCourseGroup").val();
            // $.ajax({
            //     url:""
            // })
        }

        $("#exampleInputFile").change(function () {
            $("#fileName").html($("#exampleInputFile")[0].files[0].name)
        })

        $("#submit").click(function () {
            let formData = new FormData();
            formData.append("itemType",$("#curremtItemType").val());
            formData.append("itemId",$("#currentItemId").val());
            formData.append("userId",$("#currentUserId").val());
            formData.append("courseId",$("#currentCourseId").val());
            formData.append("uniId",$("#currentUniId").val());
            formData.append("courseGroup",$("#currentCourseGroup").val());

            if ($("#exampleInputFile")[0].files[0]===undefined){

                alert("请选择文件")
                retrun;
            }
            formData.append("attachment",$("#fileName").html());
            formData.append("file",$("#exampleInputFile")[0].files[0]);

            $(".upload-bar").hide();

            $("#load-msg").text("uploading!")
            $("#loading-bar").show();

            $.ajax({
                url:"/course/uploadFile",
                method:"POST",
                data:formData,
                contentType:false,
                processData: false,
                success:function (data) {
                    if (data.code===true){
                        // $("#back").click()
                        $("#loading-bar").text("Loading!");
                        $("#loading-bar").hide();
                    }else {
                        $("#loading-bar").text("Loading!");
                        $("#loading-bar").hide();
                        alert(data.errMsg);
                    }
                }
            })
        })

    </script>
    <script>
        function doLoad(){
            $(".delete-btn").click(function (event) {

                $.ajax({
                    url:"/topicId/delete",
                    method:"DELETE",
                    data:{itemId:$(event.currentTarget).parent().attr("itemId")},
                    dataType: "JSON",
                    success:function (data) {
                        if (data.code===true){
                            $(".chapter").remove()
                            loadCourseTopicBar()
                        }
                    }
                })
            })
            $(".delete-topic-btn").click(function (event) {

                $.ajax({
                    url:"/topic/delete",
                    method:"DELETE",
                    data:{topicId:$(event.currentTarget).parent().parent().attr("topicId")},
                    dataType: "JSON",
                    success:function (data) {
                        if (data.code===true){
                            $(".chapter").remove()
                            loadCourseTopicBar()
                        }
                    }
                })
            })


        }


    </script>
</body>
</html>